<GridLayout rows="100, *" columns="*" sdkExampleTitle sdkToggleNavButton>
    <!-- >> using-ngswitch-html -->
    <FlexboxLayout row="0" flexDirection="row">
        <Button flexShrink="0" class="btn btn-primary btn-active" margin="15" width="80" text="Blue" (tap)="onBlue()"></Button>
        <Button flexShrink="0" class="btn btn-primary btn-active" margin="15" width="80" text="Purple" (tap)="onPurple()"></Button>
        <Button flexShrink="0" class="btn btn-primary btn-active" margin="15" width="80" text="Yellow" (tap)="onYellow()"></Button>
    </FlexboxLayout>

    <GridLayout row="1" [ngSwitch]="color" class="p-15 m-t-15" height="280" borderRadius="2">
        <GridLayout *ngSwitchCase="'purple'" backgroundColor="#8C489F"></GridLayout>
        <GridLayout *ngSwitchCase="'blue'" backgroundColor="#0077AF"></GridLayout>
        <GridLayout *ngSwitchCase="'yellow'" backgroundColor="#FFFF66"></GridLayout>
        <GridLayout *ngSwitchDefault backgroundColor="gray"></GridLayout>
    </GridLayout>
    <!-- << using-ngswitch-html -->
</GridLayout>